<!--
 * @Author: zxc
 * @Date: 2020-08-24 09:07:26
 * @LastEditTime: 2020-09-17 19:51:51
 * @LastEditors: zxc
 * @Description:
-->
<template>
  <div class="home">
    <!-- <img alt="Vue logo" src="../assets/logo.png"> -->
    <!-- <HelloWorld msg="Welcome to Your Vue.js App"/> -->
    <!-- <button @click="goBack">goBack</button>
    <button @click="handelClick('push')">跳转至parent</button>
    <button @click="handelClick('arg')">跳转至arg</button>
    <button @click="handelClick('replace')">replace到parent</button> -->
    <!-- <div>
      <button @click="handleLogout">退出登录</button>
    </div> -->
    <Row>
      <i-col></i-col>
    </Row>
    <Row :gutter="10">
      <i-col span="12"></i-col>
      <i-col span="12"></i-col>
    </Row>
    <Row :gutter="10" class="blue">
      <i-col :md="6" :sm="12" :xs="24"></i-col>
      <i-col :md="6" :sm="12" :xs="24"></i-col>
      <i-col :md="6" :sm="12" :xs="24"></i-col>
      <i-col :md="6" :sm="12" :xs="24"></i-col>
    </Row>
  </div>
</template>

<script>
// @ is an alias to /src
// import HelloWorld from '_c/HelloWorld.vue'
import { mapActions } from 'vuex'

export default {
  name: 'Home',
  components: {
    // HelloWorld
  },
  // beforeRouteEnter (to, from, next) {
  //   next((vm) => {
  //     console.log(vm)
  //   })
  // },
  // beforeRouteLeave (to, from, next) {
  //   // const leave = confirm("确定要离开吗？");
  //   // if (leave) {
  //   next()
  //   // }
  // },
  data () {
    return {
      as: 'adfadfa'
    }
  },
  methods: {
    ...mapActions([
      'logout'
    ]),
    handleLogout () {
      this.logout()
      this.$router.push({
        name: 'login'
      })
    },
    goBack () {
      console.log(this.$router)
      this.$router.back()
    },
    handelClick (type) {
      if (type === 'push') {
        this.$router.push({
          path: '/parent'
        })
      } else if (type === 'arg') {
        this.$router.push({
          name: 'arg',
          params: {
            name: 'langlang'
          }
        })
      } else if (type === 'replace') {
        this.$router.replace({
          name: 'parent'
        })
      }
    }
  }
}
</script>
<style lang="less">
.home{
  .ivu-col{
    height: 50px;
    margin-top: 10px;
    background: pink;
    background-clip: content-box;
  }
  .blue{
    .ivu-col{
      background: blue;
      background-clip: content-box;
    }
  }
}
</style>
